#include("common.html")
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>澳邮国际商城</title>
    
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">
    <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/vant.css">
    <link rel="stylesheet" type="text/css" href="#(tpath)/static/css/filter.css">
    <link rel="stylesheet" type="text/css" href="#(tpath)/static/mui/css/mui.css"/>
    <script type="text/javascript" src="#(tpath)/static/js/jquery.js"></script>
    <script type="text/javascript" src="#(tpath)/static/mui/js/mui.js"></script>
  </head>
  
  <body class="">
    <style type="text/css">@media only screen and (min-width: 320px){ html { font-size: 62.5% !important; } } @media only screen and (min-width: 640px){ html { font-size: 125% !important; } } @media only screen and (min-width: 750px){ html { font-size: 150% !important; } } @media only screen and (min-width: 1242px){ html { font-size: 187.5% !important; } }</style>
    <!--样式-->
    <style type="text/css">.contact-lable { font-size: 14px; color: #333; margin-left: 10px; } .no-img-content{ width: 100%; text-align: center; background-color: #fff; height: 100%; } .no-img{ max-width: 200px; max-height: 200px; margin-top: 20px; } .no-img-title{ font-size: 14px; color: #BBBBBB; } .add-address { width: 100%; position: fixed; bottom: 0; left: 0; z-index: 600; background-color: #fff; height: 50px; } .cell-icon{ width: 30px; height: 30px; text-align: right; }</style>
    <!-- 内容 -->
    <header class="mui-bar mui-bar-nav" style="background-color: #ffffff;">
			<a href="#(base)/member" class="mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">收货地址</h1>
		</header>
    <div id="addresslist" class="mui-content container" style="overflow-y: scroll;height: calc(100% - 50px);min-height: calc(100% - 50px);">
        
     </div>   
      <div class="add-address">
      
      
        <button class="van-button van-button--danger van-button--large" onclick="location.href='#(base)/member/receiver/add'">
          <span class="van-button__text">新增地址</span></button>
      </div>
    </body>
</html>
<script>
var pageNumber = 1;
function getReceiverListHtml(){
	$.ajax({
        url: "#(base)/member/receiver/list",
        type: "post",
        data: {"pageNumber":pageNumber},
        dataType: "text",
        success: function(res){
        	$("#addresslist").animate({scrollTop: '0px'});
        	$("#addresslist").html(res);
        },
        error: function(res){
        }
    });
}

getReceiverListHtml();


     //添加滚动事件
     $("#addresslist").scroll(function(){
         scrollTop = $(this).scrollTop();
         totalHeight = $(this).height();
        console.log(scrollTop);
         if(scrollTop>(parseInt(pageNumber-1)*(65*9))){
        	 pageNumber++;
        	 $.ajax({
        	        url: "#(base)/member/receiver/list",
        	        type: "post",
        	        data: {"pageNumber":pageNumber},
        	        dataType: "text",
        	        success: function(res){
        	        	$("#addresslist").append(res);
        	        },
        	        error: function(res){
        	        }
        	    });
         }
     })
</script>